<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
</head>
<body>
  <ul>
    <li>同事
      <ul>
        <li>马云</li>
        <li>马化腾</li>
        <li>刘德华</li>
      </ul>
    </li>
    <li>亲戚
      <ul>
        <li>习大大</li>
        <li>马大姐</li>
        <li>老干妈</li>
      </ul>
    </li>
    <li>女朋友们
      <ul>
        <li>貂蝉</li>
        <li>孙尚香</li>
        <li>武则天</li>
      </ul>
    </li>
  </ul>
    <script type="text/javascript" src="../js/jquery-1.4.2.js"></script>
  <script type="text/javascript">
 $("li>ul").hide();
 $("body>ul>li").click(function(){
	 $(this).children().toggle();
	 $(this).silbings().children().hide();
 });
  </script>
</body>
</html>